﻿<!DOCTYPE html>
<html lang="zh_CN">
<head>
    <meta charset="UTF-8">
    <title>文件列表</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link href="~/lib/layui-v2.5.6/layui/css/layui.css" rel="stylesheet" />
    <link href="~/lib/font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="~/css/file.css" media="all">
    <script type="text/javascript" src="~/lib/iconfont/iconfont.js"></script>
</head>
<body>
    <div class="layui-container" style="width: 100%;">
        <div class="layui-row">
            <div class="layui-col-md12" style="padding:5px;">
                <div class="layui-card">
                    <div class="layui-card-header" style="padding: 5px;">
                        <button class="layui-btn" id="fileUpload">
                            <i class="fa fa-cloud-upload"></i>&nbsp;上传
                        </button>
                    </div>
                    <div class="layui-card-body">
                        <div class="file-list-side">
                            <span class="layui-breadcrumb" id="path-side">

                            </span>
                        </div>
                        <hr class="layui-bg-gray">
                        <div class="file-list">
                            <div class="file-list-header">
                                <ul class="file-list-header-ul">
                                    <li class="file-list-header-li file-list-name">文件名</li>
                                    <li class="file-list-header-li file-list-size">大小</li>
                                    <li class="file-list-header-li file-list-date">创建日期</li>
                                    <li class="file-list-header-li file-list-handle">操作</li>
                                </ul>
                            </div>
                            <div class="file-list-result" id="file-result">

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script id="file-list" type="text/html">
        {{if data.length > 0}}
        {{each data as value i}}
        <div class="file-list-file-box">
            {{if value.is_dir}}
            <a class="file-list-file file-list-file-name resultDir" href="javascript:;" data-path="{{value.path}}"
               data-name="{{value.name}}" data-md5="{{value.md5}}">
                <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-{{value.name | iconHandler:value.is_dir}}"></use>
                </svg>
                <span>{{value.name}}</span>
            </a>
            {{else}}
            <a class="file-list-file file-list-file-name resultFile" href="javascript:;" data-path="{{value.path}}"
               data-name="{{value.name}}" data-md5="{{value.md5}}" data-peer="{{value.peerAddr}}">
                <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-{{value.name | iconHandler:value.is_dir}}"></use>
                </svg>
                <span>{{value.name}}</span>
            </a>
            {{/if}}
            <div class="file-list-file file-list-file-size">
                {{if value.is_dir}}
                -
                {{else}}
                {{value.size}}
                {{/if}}
            </div>
            <div class="file-list-file file-list-file-date">
                {{value.mTime}}
            </div>
            <div class="file-list-file file-list-file-handle">
                {{if value.is_dir == false}}
                <button class="layui-btn layui-btn-xs details-btn" data-md5="{{value.md5}}" data-name="{{value.name}}"
                        title="下载文件">
                    详情
                </button>
                <button class="layui-btn layui-btn-xs layui-btn-normal download-btn" data-path="{{value.path}}" data-name="{{value.name}}"
                        title="下载文件">
                    下载
                </button>
                <button class="layui-btn layui-btn-xs layui-btn-danger delete-file-btn" data-md5="{{value.md5}}"
                        data-name="{{value.name}}">
                    删除
                </button>
                {{/if}}
            </div>
            <div class="clear"></div>
        </div>
        {{/each}}
        {{else}}
        <div class="file-list-file-box">
            <div class="no-file-tip">暂无文件</div>
        </div>
        {{/if}}
    </script>
    <script src="~/lib/jquery/jquery-3.5.1.min.js"></script>
    <script src="~/lib/layui-v2.5.6/layui/layui.all.js"></script>
    <script src="~/lib/template-web/template-web.js"></script>
    <script src="~/js/kit.js"></script>
    <script src="~/js/file.js"></script>
</body>
</html>